<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%--
  Created by IntelliJ IDEA.
  User: Muyid
  Date: 2022/4/14
  Time: 15:46
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>店铺详情</title>
    <link rel="stylesheet" href="${path}/plugins/layui/css/layui.css" media="all">
    <link rel="stylesheet" href="${path}/plugins/bootstrap-3.4.1-dist/css/bootstrap.css">
    <link rel="stylesheet" href="${path}/css/storeInfo/storeInfo.css">
    <!-- 引入登录所需要的h+ -->
    <link href="${path}/plugins/Hplus/css/font-awesome.css" rel="stylesheet">
    <link href="${path}/plugins/Hplus/css/animate.css" rel="stylesheet">
    <link href="${path}/plugins/Hplus/css/style.css" rel="stylesheet">


</head>
<body>
<div class="container">
    <div class="row"><a href="/fr/fr/classify"><span class="glyphicon glyphicon-chevron-left">返回上一层</span></a></div>
    <div class="inner">
        <div class="row col-md-6" style="padding-left: 0px;">
            <ul class="location">
                <li>
                    <a href="">
                        <span>${fShop.province}</span>
                    </a>&nbsp;
                    <span class="glyphicon glyphicon-chevron-right">
                    </span>&nbsp;
                </li>
                <li>
                    <a href="">
                        <span>${fShop.city}</span>
                    </a>
                    <span class="glyphicon glyphicon-chevron-right">
                    </span>
                </li>
                <li>
                    <a href="">
                        <span>${fShop.area}</span>
                    </a>
                    <span class="glyphicon glyphicon-chevron-right">
                    </span>
                </li>
                <li>
                    <a href="">
                        <span>${fShop.shopName}</span>
                    </a>
                </li>
            </ul>
        </div>
    </div>
    <div class="store-info">
        <div class="row info-name">
            <div class="row">
                <h1>${fShop.shopName}</h1>
            </div>
            <div class="row col-md-12"
                 style="height: 19.2px;float: left;cursor: pointer;padding-left: 0px;margin-top: 4px;">
                <a href="" style="float: left;margin-top: -1.5px;">
                    <%--                评分展示--%>
                    <div id="score"></div>
                    <span style="font-size: 14px;color: #4a4a4a;margin-left: 5px;">
                        ${countComment}&nbsp;条点评
                    </span>
                </a>
                <span style="cursor: pointer;padding-left: 20px;color: #4a4a4a38;float: left;">|
                        <a href="" style="margin-left: 20px;color: #4a4a4a">
                            联系方式：${fShop.shopTelnumber}
                        </a>
                </span>
                <div class="cft" style="float: left;">
                    <span style="padding-left: 20px;color: #4a4a4a38;margin-right: 20px;">|</span>
                    <%--                    <a href="">￥</a>--%>
                    <a href="">
                        <c:choose>
                            <c:when test="${fShop.type==1}">中餐</c:when>
                            <c:when test="${fShop.type==2}">甜品</c:when>
                            <c:when test="${fShop.type==3}">西餐</c:when>
                            <c:otherwise>未知类型</c:otherwise>
                        </c:choose>
                    </a>
                    <%--                    <a href="">亚洲料理</a>--%>
                    <%--                    <a href="">汤</a>--%>
                </div>
            </div>
        </div>
        <div class="row info-location">
            <div class="location-left col-md-6" style="cursor: pointer;">
                <img src="${path}/imgs/storeInfo/定位.png" alt="">
                <span class="show-map">
                        ${fShop.province}&nbsp;${fShop.city} ${fShop.area}&nbsp;${fShop.place}
                    </span>

                <span style="margin-left: 5px;color: #4a4a4a38;margin-right: 5px;">|</span>
                <img src="${path}/imgs/storeInfo/时间.png" alt="">
                <span>
                        营业时间:&nbsp;${fShop.businessTime}
                    </span>
            </div>
            <div class="location-right">
                <span style="margin-right: 10px;"><img src="${path}/imgs/storeInfo/举报.png" alt="">举报</span>
                <span><img src="${path}/imgs/storeInfo/爱心.png" alt="">收藏</span>
            </div>
        </div>
    </div>
</div>
<%--<div class="container-fluid navbox" style="padding: 0;">--%>
<%--    <div class="nav">--%>
<%--        <div class="nav-title"><span>照片</span></div>--%>
<%--        <div class="nav-title"><span>概况</span></div>--%>
<%--        <div class="nav-title"><span>点评</span></div>--%>
<%--    </div>--%>
<%--</div>--%>

<div class="container">

    <div class="row info-photo" id="shopPicture">
        <%--     店铺图片--%>
    </div>
    <div id="outerdiv"
         style="position:fixed;top:0;left:0;background:rgba(0,0,0,0.7);z-index:2;width:100%;height:100%;display:none;">
        <div id="innerdiv" style="position:absolute;">
            <img id="bigimg" style="border:5px solid #fff;" src=""/>
        </div>
    </div>
</div>
</div>
<div class="container-fluid delineation">
    <div class="container">
        <div class=" details">
            <div class="wrapper">
                <div class="wrapper-top">
                    <h2>评分和点评</h2>
                    <div class="scores">
                        <span class="score">
                            ${fShopFractionDto.score}
                        </span>
                        <span>
                            <div id="score1"></div>
                        </span>
                        <a class="review" href="">${countComment}条点评</a>
                    </div>
                    <div><span>苏州市排名第 11 的餐厅（共 815 个）</span></div>
                </div>
                <div class="wrapper-bottom">
                    <div class="bottom-top"><span>评分</span></div>
                    <div class="bottom-bottom">
                        <div class="score-info">
                            <span><img class="bottom-icon" src="${path}/imgs/storeInfo/刀叉.png" alt=""></span>
                            <span>口味</span>
                            <span style="float: right;"><div id="flavor"></div></span>
                        </div>
                        <div class="score-info">
                            <span><img class="bottom-icon" src="${path}/imgs/storeInfo/树叶.png" alt=""></span>
                            <span>环境</span>
                            <span style="float: right;"><div id="environment"></div></span>
                        </div>
                        <div class="score-info">
                            <span><img class="bottom-icon" src="${path}/imgs/storeInfo/早餐.png" alt=""></span>
                            <span>服务</span>
                            <span style="float: right;"><div id="service"></div></span>
                        </div>
                        <div class="score-info">
                            <span><img class="bottom-icon" src="${path}/imgs/storeInfo/钱包.png" alt=""></span>
                            <span>人均</span>
                            <span style="float: right;"><span>￥&nbsp;${fShop.consumption}&nbsp;</span></span>
                        </div>
                    </div>
                </div>
            </div>

            <div class="wrapper">
                <div>
                    <h2>详情</h2>
                    <div>
                        <span class="d-infoone">美食类型</span>
                        <div class="d-infotwo">
                            <span>
                                <c:choose>
                                    <c:when test="${fShop.type==1}">中餐</c:when>
                                    <c:when test="${fShop.type==2}">甜品</c:when>
                                    <c:when test="${fShop.type==3}">西餐</c:when>
                                    <c:otherwise>未知类型</c:otherwise>
                                </c:choose>
                            </span>
                        </div>
                    </div>
                    <div>
                        <span class="d-infoone">餐食</span>
                        <div class="d-infotwo">
                            <span>早餐,午餐,早午餐</span>
                        </div>
                    </div>
                    <div class="info-bottom">
                        <a href="">查看所有详情</a>
                        <div>
                            <span class="d-infoone one-font">餐食,功能</span>
                        </div>
                    </div>
                </div>
            </div>

            <div class="wrapper">
                <div class="wrapper-top">
                    <h2>联系方式</h2>
                    <div class="wrapper-map" id="wrapper-map"></div>
                    <div class="map-location">
                        <img src="${path}/imgs/storeInfo/定位.png" alt="">
                        <span>
                            ${fShop.province}&nbsp;${fShop.city}&nbsp;${fShop.area}&nbsp;${fShop.place}
                        </span>
                    </div>
                </div>
            </div>
        </div>
        <!-- 优惠团购 -->
        <div class="row meun">
            <div class="row related">
                <div class="top-left">
                    <a href="">优惠团购</a>
                </div>
                <%--                <div class="top-right">--%>
                <%--                    <a href="">查看所有</a>--%>
                <%--                </div>--%>
            </div>
            <div class="group">
                <c:choose>
                    <c:when test="${fGoodslist.size() == 0}">
                        <div align="center" style="font-size: 35px">
                            <h4 style="margin-top: 0">抱歉，该店铺暂无团购优惠！</h4>
                        </div>
                    </c:when>
                </c:choose>

                <c:forEach var="good" items="${fGoodslist}">
                    <div class="item" onclick="goodsInfo(${good.id},${fShop.id})">
                        <input class="hidden" name="goodId" value="${good.id}">
                        <p class="title">${good.goodsName}</p>
                        <img class="pic1" src="${path}/${good.goodsPicture}" alt="">
                        <span class="price">
                            <em>￥</em>${good.goodsCurrentPrice}
                        </span>
                        <del class="del-price">￥${good.goodsOriginalPrice}</del>
                        <i class="tag tag-tuan"> 团</i>
                        <span class="sold-count">已售${good.goodsSold}</span>
                    </div>
                </c:forEach>
            </div>
        </div>

        <%--        <!-- 菜品展示 -->--%>
        <%--        <div class="row meun">--%>
        <%--            <div class="row related">--%>
        <%--                <div class="top-left">--%>
        <%--                    <a href="">热门菜品</a>--%>
        <%--                </div>--%>
        <%--                <div class="top-right">--%>
        <%--                    <a href="">查看所有</a>--%>
        <%--                </div>--%>
        <%--            </div>--%>
        <%--            <div class="row related-info">--%>
        <%--                <div class="fouritem">--%>
        <%--                    <a href="">--%>
        <%--                        <img src="${path}/imgs/storeInfo/related01.jpg" alt="">--%>
        <%--                    </a>--%>
        <%--                    <div class="fouritem-bottom">--%>
        <%--                        <div class="rname"><a href="">海岛餐厅</a></div>--%>
        <%--                        <div class="item-score">--%>
        <%--                            <span>评分</span>--%>
        <%--                            <span>多少条点评</span>--%>
        <%--                        </div>--%>
        <%--                        <div class="item-price">--%>
        <%--                            <span>￥，餐厅</span>--%>
        <%--                        </div>--%>
        <%--                    </div>--%>
        <%--                </div>--%>
        <%--            </div>--%>
        <%--            <div class="row related-info">--%>
        <%--                <div class="fouritem">--%>
        <%--                    <a href="">--%>
        <%--                        <img src="${path}/imgs/storeInfo/related01.jpg" alt="">--%>
        <%--                    </a>--%>
        <%--                    <div class="fouritem-bottom">--%>
        <%--                        <div class="rname"><a href="">海岛餐厅</a></div>--%>
        <%--                        <div class="item-score">--%>
        <%--                            <span>评分</span>--%>
        <%--                            <span>多少条点评</span>--%>
        <%--                        </div>--%>
        <%--                        <div class="item-price">--%>
        <%--                            <span>￥，餐厅</span>--%>
        <%--                        </div>--%>
        <%--                    </div>--%>
        <%--                </div>--%>
        <%--            </div>--%>
        <%--            <div class="row related-info">--%>
        <%--                <div class="fouritem">--%>
        <%--                    <a href="">--%>
        <%--                        <img src="${path}/imgs/storeInfo/related01.jpg" alt="">--%>
        <%--                    </a>--%>
        <%--                    <div class="fouritem-bottom">--%>
        <%--                        <div class="rname"><a href="">海岛餐厅</a></div>--%>
        <%--                        <div class="item-score">--%>
        <%--                            <span>评分</span>--%>
        <%--                            <span>多少条点评</span>--%>
        <%--                        </div>--%>
        <%--                        <div class="item-price">--%>
        <%--                            <span>￥，餐厅</span>--%>
        <%--                        </div>--%>
        <%--                    </div>--%>
        <%--                </div>--%>
        <%--            </div>--%>
        <%--            <div class="row related-info">--%>
        <%--                <div class="fouritem">--%>
        <%--                    <a href="">--%>
        <%--                        <img src="${path}/imgs/storeInfo/related01.jpg" alt="">--%>
        <%--                    </a>--%>
        <%--                    <div class="fouritem-bottom">--%>
        <%--                        <div class="rname"><a href="">海岛餐厅</a></div>--%>
        <%--                        <div class="item-score">--%>
        <%--                            <span>评分</span>--%>
        <%--                            <span>多少条点评</span>--%>
        <%--                        </div>--%>
        <%--                        <div class="item-price">--%>
        <%--                            <span>￥，餐厅</span>--%>
        <%--                        </div>--%>
        <%--                    </div>--%>
        <%--                </div>--%>
        <%--            </div>--%>
        <%--        </div>--%>

        <!-- 评论 -->
        <div class="comment-left">
            <div class="row comment">
                <div class="comment-title">
                    <div class="title-info">
                        <div><span><img name="comment" src="${path}/imgs/storeInfo/评论1.png" alt=""></span></div>
                        <div><span>${countComment}</span></div>
                        <div><span>条点评</span></div>
                    </div>
                </div>
                <%--      评论--%>
                <div class="comments" id="comments">
                </div>
            </div>
        </div>
        <div class="comment-right">
            <div class="Related-food">
                <div class="row related">
                    <div class="top-left">
                        <a href="">相关推荐</a>
                    </div>
                </div>
                <div class="row related-info">
                    <c:choose>
                        <c:when test="${shops.size() == 0}">
                            <div align="center" style="font-size: 25px;margin: 20px 30px;">
                                <h4>抱歉，暂无其他推荐！</h4>
                            </div>
                        </c:when>
                    </c:choose>
                    <c:forEach var="shop" items="${shops}">
                        <div class="fouritem">
                            <a href="">
                                <img src="${path}/imgs/storeInfo/related01.jpg" alt="">
                            </a>
                            <div class="fouritem-bottom">
                                <div class="rname"><a href="">${shop.shopName}</a></div>
                                <div class="item-score">
                                    <span>评分:${shop.shopScore}</span>
                                </div>
                                <div class="item-price">
                                    <span>
                                         <c:choose>
                                             <c:when test="${shop.type==1}">中餐</c:when>
                                             <c:when test="${shop.type==2}">甜品</c:when>
                                             <c:when test="${shop.type==3}">西餐</c:when>
                                             <c:otherwise>未知类型</c:otherwise>
                                         </c:choose>
                                    </span>
                                </div>
                            </div>
                        </div>
                    </c:forEach>
                </div>
            </div>
        </div>


        <!-- 分页 -->
        <div class="pages">

        </div>
    </div>
</div>

<input type="hidden" name="userIdHid" value="${user.id}">
<!--三、引入高德地图的js-->
<script src="https://webapi.amap.com/maps?v=1.4.13&key=221c6900cf865cccbcf2a25c228e4f26"></script>
<script src="https://a.amap.com/jsapi_demos/static/demo-center/js/demoutils.js"></script>


<!-- 引入jquery框架 -->
<script src="${path}/plugins/jquery.min.js"></script>
<script src="${path}/js/storeInfo/storeInfo.js"></script>


<!-- 引入bootstrap.js/bootstrap.min.js,bootstrap依赖于jquery框架 -->
<script src="${path}/plugins/bootstrap-3.4.1-dist/js/bootstrap.js"></script>
<script src="${path}/plugins/layui/layui.js" charset="utf-8"></script>
<script src="${path}/js/index/login.js"></script>
<script>
    window.onload = function () {
        // 图片点击放大缩小
        $(".pic").click(function () {
            var _this = $(this); //将当前的pimg元素作为_this传入函数
            imgShow("#outerdiv", "#innerdiv", "#bigimg", _this);
        });

        $('.Level-2-reply').each(function (i) {
            $(this).click(function () {
                    if (${sessionScope.user == null}) {
                        alert("您还未登录，请先登录！")
                    } else {
                        if ($('.reply-card').eq(i).is('.r2')) {
                            $('.reply-card').eq(i).removeClass("r2");
                        } else {
                            $('.reply-card').eq(i).addClass("r2");
                        }
                    }
                }
            )
        })

        $('.Level-1-reply').each(function (i) {
            $(this).click(function () {
                    if (${sessionScope.user == null}) {
                        alert("您还未登录，请先登录！")
                    } else {
                        if ($('.reply-comment').eq(i).is('.r1')) {
                            $(".reply-comment").eq(i).removeClass("r1");
                        } else {
                            $(".reply-comment").eq(i).addClass("r1");
                        }
                    }
                }
            )
        })
    }

    $(function () {
        $.ajax({
            type: 'post',
            //内部的js代码允许使用EL表达式的
            //jsp和js合二为一在同一个jsp文件中的 -> 容器执行的 - 编译jsp
            url: '${path}/storeInfo/picture/${fShop.id}',
            success: function (data) {
                if (data.code == 200) {
                    let str = "<div style='width:476px;'>\n" +
                        "    <img class='img1 pic' src='/fr" + data.data.url1 + "' alt=''>\n" +
                        "</div>\n" +
                        "<div style='width: 239px;margin-left: 1px;'>\n" +
                        "    <img class='img2 pic' src='/fr" + data.data.url2 + "' alt=''>\n" +
                        "</div>\n" +
                        "<div style='display: flex;'>\n" +
                        "    <div style='width: 240px;margin-left: 1px;'>\n" +
                        "<img class='pic' src='/fr" + data.data.url3 + "' alt=''\n" +
                        "     style='width: 100%;height: 162px;object-fit: cover;margin-bottom: 2px;'>\n" +
                        "<img class='pic' src='/fr" + data.data.url4 + "' alt=''\n" +
                        "     style='width: 100%;height: 162px;object-fit: cover;'>\n" +
                        "    </div>\n" +
                        "    <div style='width: 240px;margin-left: 1px;'>\n" +
                        "<img class='pic' src='/fr" + data.data.url5 + "' alt=''\n" +
                        "     style='width: 100%;height: 162px;object-fit: cover;margin-bottom: 2px;'>\n" +
                        "<img class='pic' src='/fr" + data.data.url6 + "' alt=''\n" +
                        "     style='width: 100%;height: 162px;object-fit: cover;'>\n" +
                        "    </div>\n" +
                        "</div>";
                    $('#shopPicture').html(str);
                } else {
                    $('#shopPicture').html("图片请求失败！");
                }
            }
        })

        var flag = false; //标识，表示页面上数据还未处理完成
        let userId = $("input[name='userIdHid']").val();
        $.ajax({
            type: 'post',
            //内部的js代码允许使用EL表达式的
            //jsp和js合二为一在同一个jsp文件中的 -> 容器执行的 - 编译jsp
            url: '${path}/storeInfo/comments/${fShop.id}/1',
            success: function (data) {
                console.log(data.data);
                let list = data.data;
                let str = "";
                let page = "";
                let Page = "";
                $.each(list, function (index, item) {
                    //console.log("current" + item.current);
                    //console.log("page" + item.page);
                    console.log(item);
                    str += "<div class='comment-info'>\n" +
                        "    <div class='coment-top'>\n" +
                        "        <a href=''><img src='" + item.headPicture + "' alt=''></a>\n" +
                        "        <div class='customer-name'>\n" +
                        "                <span>\n" +
                        "                    <a href=''>\n" +
                        "        " + item.userName + "\n" +
                        "                    </a>\n" +
                        "                    &nbsp;写了一条评价\n" +
                        "                    " + item.commentTime + "\n" +
                        "                </span>\n" +
                        "        </div>\n" +
                        "    </div>\n" +
                        "    <div class='customer-comment'>\n" +
                        "        <div>\n" +
                        "            <div id='score2'></div>\n" +
                        "        </div>\n" +
                        "        <div>\n" +
                        "            <div class='row boxp box'>\n" +
                        "                <q>\n" +
                        "        <span>\n" +
                        "            " + item.content + "\n" +
                        "        </span>\n" +
                        "                </q>\n" +
                        "            </div>\n" +
                        "            <div class='row info-more'>\n" +
                        "                <span class='more-text'>阅读更多</span>\n" +
                        "                <span class='glyphicon glyphicon-chevron-down'></span>\n" +
                        "            </div>\n" +
                        "            <div class='row more-details'>\n" +
                        "                <div class='row'>\n"
                    if (item.url1 != null) {
                        str += " <img src='" + item.url1 + "' alt=\"\" style=\"width: 80px;height: 60px;object-fit: cover;margin-right: 2px;\">\n"
                    }
                    if (item.url2 != null) {
                        str += " <img src='" + item.url2 + "' alt=\"\" style=\"width: 80px;height: 60px;object-fit: cover;margin-right: 2px;\">\n"
                    }
                    if (item.url3 != null) {
                        str += " <img src='" + item.url3 + "' alt=\"\" style=\"width: 80px;height: 60px;object-fit: cover;margin-right: 2px;\">\n"
                    }
                    if (item.url4 != null) {
                        str += " <img src='" + item.url4 + "' alt=\"\" style=\"width: 80px;height: 60px;object-fit: cover;margin-right: 2px;\">\n"
                    }
                    if (item.url5 != null) {
                        str += " <img src='" + item.url5 + "' alt=\"\" style=\"width: 80px;height: 60px;object-fit: cover;margin-right: 2px;\">\n"
                    }
                    if (item.url6 != null) {
                        str += " <img src='" + item.url6 + "' alt=\"\" style=\"width: 80px;height: 60px;object-fit: cover;margin-right: 2px;\">\n"
                    }
                    str += "                </div>\n" +
                        "            </div>\n" +
                        "        </div>\n" +
                        "    </div>\n" +
                        "\n" +
                        "    <div class='praise'>\n" +
                        "        <div class='row'>\n" +
                        "            <div style='float: left;'>\n" +
                        "                <a >\n" +
                        "        <span class=\"Level-1-reply\">\n" +
                        "            回复\n" +
                        "        </span>\n" +
                        "                </a>\n" +
                        "            </div>\n" +
                        "            <div id='ZanShow" + index + "' style='float: right;'>\n" +
                        "\n";
                    if (item.status == 3) {
                        str += "        <span>\n" +
                            "            <img src='/fr/imgs/storeInfo/爱心.png' alt=''>\n" +
                            "        </span>\n" +
                            "        <a href='javascript:void(0);' onclick=\"zan_method(" + userId + "," + item.commentId + "," + index + ")\">\n" +
                            "       <span id='zanCount" + index + "'></span>" +
                            "       <span>\n" +
                            "                点赞&nbsp;\n" +
                            "            </span>\n" +
                            "        </a>\n" +
                            "                    </span>\n" +
                            "            </div>\n" +
                            "        </div>\n" +
                            "    </div>"

                    } else {
                        str += "        <span>\n" +
                            "            <img src='/fr/imgs/storeInfo/爱心赞.png' alt=''>\n" +
                            "        </span>\n" +
                            "        <a href='javascript:void(0);' onclick=\"cancelZan_method(" + userId + "," + item.commentId + "," + index + ")\">\n" +
                            "       <span id='zanCount" + index + "'></span>" +
                            "       <span>\n" +
                            "                取消点赞&nbsp;\n" +
                            "            </span>\n" +
                            "        </a>\n" +
                            "                    </span>\n" +
                            "            </div>\n" +
                            "        </div>\n" +
                            "    </div>\n" +
                            "</div>";
                    }


                    str += "    <div class='reply-wapper'>\n" +
                        "        <div class='reply-comment r1'>\n" +
                        "            <form id='reply-form" + index + "' action=''>\n" +
                        "              <div class='form-top'>\n" +
                        "                  <small class='text-secondary'>回复" +
                        "                       <a>" + item.userName + "</a>\n" +
                        "                  </small>\n" +
                        "                  <input id='userId' name='userId' value='" + ${sessionScope.user.id} + "' style=\"display: none\">" +
                        "                  <input id='commentId' name='commentId' value='" + item.commentId + "' style=\"display: none\">" +
                        "                  <div class='reply-content'>" +
                        "                   <textarea rows='1' placeholder='撰写回复 …' id='content' name='content' class='form-control form-control-sm comment-reply mt-2 form-control form-control-sm'\n" +
                        "                       style='overflow-x: hidden; overflow-wrap: break-word; height: 34px;resize: vertical;'></textarea>\n" +
                        "                  </div>\n" +
                        "               </div>\n" +
                        "              <div class='form-bottom'>\n" +
                        "                  <button type='button' id='submit-reply' onclick='reply_method(" + index + ")' class='float-end btn btn-primary btn-sm'>提交评论</button>\n" +
                        "              </div>\n" +
                        "             </form>\n" +
                        "       </div>\n" +
                        "       <div class='reply-info" + index + " ri'>\n" +
                        "       </div>\n" +
                        "  </div>\n" +
                        "</div>"

                    let commentId = item.commentId;
                    console.log("commentId：" + commentId);

                    getReply(item.commentId, index);

                    page = "<div class='comment-info'>" +
                        "<ul class=\"page-info\">";
                    if (item.current >= 2) {
                        page += "<li class=\"previous-page ui-button\"><a href=\"javascript:void(0);\" role=\"button\" aria-disabled=\"true\" aria-label=\"Previous page\" onclick=\"js_method(" + (item.current - 1) + ")\">上一页</a></li>";
                    } else {
                        page += " <li class=\"previous-page ui-button\" class=\"disabled\"><a role=\"button\" aria-disabled=\"true\" aria-label=\"Previous page\">上一页</a></li>";
                    }
                    if (item.current > 3 && item.current + 3 <= item.page) {
                        for (let i = item.current - 3; i <= item.current + 3; i++) {
                            if (i == item.current) {
                                page += "<li  class=\"active\" style='background-color: #1ab394;border-radius: 3px;'><a role=\"button\" class=\"pageNum\" tabindex=\"0\">" + i + "</a></li>";
                            } else {
                                page += "<li><a role=\"button\" class=\"pageNum\" tabindex=\"0\" href=\"javascript:void(0);\" onclick=\"js_method(" + i + ")\">" + i + "</a></li>"
                            }
                        }

                    } else if (item.current >= 1 && item.current < 4 && item.page >= 7) {
                        for (let i = 1; i <= 7; i++) {
                            if (i == item.current) {
                                page += "<li  class=\"active\" style='background-color: #1ab394;border-radius: 3px;'><a role=\"button\" class=\"pageNum\" tabindex=\"0\">" + i + "</a></li>";
                            } else {
                                page += "<li><a role=\"button\" class=\"pageNum\" tabindex=\"0\" href=\"javascript:void(0);\" onclick=\"js_method(" + i + ")\">" + i + "</a></li>"
                            }
                        }
                    } else {
                        for (let i = (item.page - 6) >= 0 ? (item.page - 6) : 1; i <= item.page; i++) {
                            if (i == item.current) {
                                page += "<li  class=\"active\" style='background-color: #1ab394;border-radius: 3px;'><a role=\"button\" class=\"pageNum\" tabindex=\"0\">" + i + "</a></li>";
                            } else {
                                page += "<li><a role=\"button\" class=\"pageNum\" tabindex=\"0\" href=\"javascript:void(0);\" onclick=\"js_method(" + i + ")\">" + i + "</a></li>"
                            }
                        }
                    }
                    if (item.current < item.page) {
                        page += "<li class=\"previous-page ui-button\" style=\"float: right;\"><a role=\"button\" aria-disabled=\"true\" aria-label=\"Previous page\" href=\"javascript:void(0);\" onclick=\"js_method(" + (item.current + 1) + ")\">下一页</a></li>";
                    } else {
                        page += " <li class=\"previous-page ui-button disabled\"><a role=\"button\" aria-disabled=\"true\" aria-label=\"Previous page\">下一页</a></li>";
                    }

                    // page += "     <li><a>当前页" + item.current + "/" + item.page + "总页数</a></li>" +
                    //     "   </ul>" +
                    //     "</div>";
                    Page = page;
                    $.ajax({
                        type: 'post',
                        url: '/fr/storeInfo/zanCount/' + item.commentId + '',
                        success: function (res) {
                            console.log("点赞数:" + res.data)
                            $("#zanCount" + index + "").html(res.data)
                        }
                    })
                })
                flag = true;
                $(".comments").html(str);
                $(".pages").html(Page);

                //显示三行 多余隐藏 点击展开
                $('.info-more').each(function (i) {
                    $(this).click(function () {
                        if ($('.boxp').eq(i).is('.box')) {
                            $('.boxp').eq(i).removeClass('box');
                            $(this).eq(i).children("span.more-text").text("收起全文");
                            $(this).eq(i).children("span.glyphicon-chevron-down").removeClass("glyphicon-chevron-down");
                            $(this).eq(i).children("span.glyphicon").addClass("glyphicon-chevron-up")
                        } else {
                            $(this).eq(i).children("span.more-text").text("阅读更多");
                            $(this).eq(i).children("span.glyphicon-chevron-up").removeClass("glyphicon-chevron-up");
                            $(this).eq(i).children("span.glyphicon").addClass("glyphicon-chevron-down")
                            $('.boxp').eq(i).addClass('box');
                        }
                        $('.more-details').eq(i).toggle();
                        $('.more-detail').eq(i).toggle();
                    });
                })


            }
        })


        var loadFile;

        loadFile = setInterval(function () {//定时检测

            if (flag) {//如果数据已经处理完毕

                loadjscssfile('http://localhost:8081/fr/css/storeInfo/storeInfo.css', "css"); //加载你的css文件

                loadjscssfile('http://localhost:8081/fr/js/storeInfo/storeInfo.js', "js"); //加载你的js文件

                clearTimeout(loadFile);//取消定时检测节省开销

            }

        }, 50);


        var map = map = new AMap.Map('wrapper-map', {
            zoom: 16, //设置地图显示的缩放级别
            center: [${coordinate}]
        });

        var marker = new AMap.Marker({
            position: new AMap.LngLat(${coordinate}), // 经纬度对象，也可以是经纬度构成的一维数组[120.712113, 31.318868]
            title: '${fShop.shopName}'
        });

        map.add(marker);

    })

    function goodsInfo(goodId, shopId) {
        window.location.href = 'http://localhost:8081/fr/groupon/enter/' + shopId + '/' + goodId + ''
    }

    function reply_method(index) {
        let data = {};
        let value = $("#reply-form" + index + "").serializeArray();
        $.each(value, function (index, item) {
            data[item.name] = item.value;
        });
        let json = JSON.stringify(data);
        console.log(json);
        $.ajax({
            type: 'post',
            url: '/fr/storeInfo/reply',
            contentType: 'application/json',
            dataType: 'json',
            data: json,
            success: function (data) {
                console.log(data);
                console.log(data.data)
                alert("回复成功！")
                js_method(1);
            }
        })
    }


    function getReply(commentId, index) {
        $.ajax({
            type: 'post',
            url: '${path}/storeInfo/replies/' + commentId + '/0',
            success: function (data) {
                console.log(data.data);
                console.log("length:" + data.data.length);
                let reply_info = "";
                if (data.data.length > 0) {
                    let list = data.data;
                    $.each(list, function (index, item) {
                        console.log(item);
                        reply_info += "<div class='info-t'>\n" +
                            "      <div class='reply-name'>\n" +
                            "          <a href=''>" + item.userName + "</a>\n" +
                            "      </div>\n" +
                            "      <div class='reply-contents'>\n" +
                            "          <p>" + item.content + "</p>\n" +
                            "      </div>\n" +
                            "  </div>\n" +
                            "  <div class='info-b'>\n" +
                            "      <div>\n" +
                            "          <a href=''>\n" +
                            "              <i class='layui-icon layui-icon-praise' style='font-size: 20px;'></i>\n" +
                            "          </a>\n" +
                            "          <span class='Level-2-reply'>回复</span>\n" +
                            "          <span>" + item.replyTime + "</span>\n" +
                            "      </div>\n" +
                            "  </div>\n" +
                            "  <div class='reply-card r2'>\n" +
                            "      <form id='reply2-form" + index + "' action=''>\n" +
                            "          <div class='form-top'>\n" +
                            "              <small class='text-secondary'>回复\n" +
                            "                  <a>" + item.userName + "</a>\n" +
                            "              </small>\n" +
                            "              <input id='userId' name='userId' value='" + ${sessionScope.user.id} + "' style=\"display: none\">" +
                            "              <input id='commentId' name='commentId' value='" + item.commentId + "' style=\"display: none\">" +
                            "              <input id='replyId' name='replyId' value='" + item.id + "' style=\"display: none\">" +
                            "              <div class='reply-content'>\n" +
                            "                  <textarea rows='1' id='content' name='content' placeholder='撰写回复 …'\n" +
                            "                      class='form-control form-control-sm comment-reply mt-2 form-control form-control-sm'\n" +
                            "                      style='overflow-x: hidden; overflow-wrap: break-word; height: 34px;resize: vertical;'></textarea>\n" +
                            "              </div>\n" +
                            "          </div>\n" +
                            "          <div class='form-bottom' style='margin-left: 595px'>\n" +
                            "              <button type='button' onclick='reply_method2(" + index + ")' class='float-end btn btn-primary btn-sm'>提交回复</button>\n" +
                            "          </div>\n" +
                            "      </form>\n" +
                            "  </div>\n" +
                            "  <div class='reply2-info" + index + " ri' style='margin: 0 20px;'>\n" +
                            "  </div>"
                        getReply2(item.commentId, item.id, index);
                    })
                } else {
                    reply_info = '';
                }
                $(".reply-info" + index + "").html(reply_info);

            }
        })
    }

    function getReply2(commentId, replyId, index) {
        $.ajax({
            type: 'post',
            url: '${path}/storeInfo/replies/' + commentId + '/' + replyId,
            success: function (data) {
                console.log(data.data);
                console.log("lengths:" + data.data.length);
                let reply_info = "";
                if (data.data.length > 0) {
                    let list = data.data;
                    $.each(list, function (index, item) {
                        console.log(item.userName);
                        reply_info += " <div class=\'info-t\'>\n" +
                            "   <div class=\\'reply-name\\'>\n" +
                            "          <a href=\'\'>" + item.userName + "</a>\n" +
                            "   </div>\n" +
                            "      <div class=\'reply-contents\'>\n" +
                            "          <p>" + item.content + "</p>\n" +
                            "       </div>\n" +
                            "</div>\n" +
                            " <div class=\'info-b\'>\n" +
                            "      <div>\n" +
                            "           <a href=\'\'>\n" +
                            "              <i class=\'layui-icon layui-icon-praise\' style=\'font-size: 20px;\'></i>\n" +
                            "          </a>\n" +
                            "          <span class=\'Level-3-reply\'>回复</span>\n" +
                            "           <span>" + item.replyTime + "</span>\n" +
                            "      </div>\n" +
                            "  </div>";
                    })
                } else {
                    reply_info = '';
                }

                $(".reply2-info" + index + "").html(reply_info);
            }
        })
    }

    function reply_method2(index) {
        let data = {};
        let value = $("#reply2-form" + index + "").serializeArray();
        $.each(value, function (index, item) {
            data[item.name] = item.value;
        });
        let json = JSON.stringify(data);
        console.log(json);
        $.ajax({
            type: 'post',
            url: '/fr/storeInfo/reply',
            contentType: 'application/json',
            dataType: 'json',
            data: json,
            success: function (data) {
                console.log(data);
                console.log(data.data)
                alert("回复成功！")
                js_method(1);
            }
        })
    }

    function zan_method(userId, commentId, index) {
        $.ajax({
            type: 'post',
            url: '/fr/storeInfo/doZan/' + userId + '/' + commentId + '',
            success: function (res) {
                if (res.code == 200) {
                    alert("你已成功为此评论点赞");
                }
                if (res.code == 400) {
                    alert("不要重复点赞");
                }
                let str = "   <span>\n" +
                    "            <img src='/fr/imgs/storeInfo/爱心赞.png' alt=''>\n" +
                    "        </span>\n" +
                    "        <a href='javascript:void(0);' onclick=\"cancelZan_method(" + userId + "," + commentId + "," + index + ")\">\n" +
                    "       <span id='zanCount" + index + "'></span>" +
                    "       <span>\n" +
                    "                取消点赞&nbsp;\n" +
                    "            </span>\n" +
                    "        </a>\n" +
                    "                    </span>\n";
                $("#ZanShow" + index + "").html(str);
                console.log("#ZanShow" + index + "");
                $.ajax({
                    type: 'post',
                    url: '/fr/storeInfo/zanCount/' + commentId + '',
                    success: function (res) {
                        console.log("点赞数:" + res.data)
                        $("#zanCount" + index + "").html(res.data)
                    }
                })
            }
        })
    }

    function cancelZan_method(userId, commentId, index) {
        $.ajax({
            type: 'post',
            url: '/fr/storeInfo/cancelZan/' + userId + '/' + commentId + '',
            success: function (res) {
                console.log("取消点赞")
                if (res.code == 200) {
                    alert(res.msg);
                }
                if (res.code == 400) {
                    alert(res.msg);
                }
                let str = "   <span>\n" +
                    "            <img src='/fr/imgs/storeInfo/爱心.png' alt=''>\n" +
                    "        </span>\n" +
                    "        <a href='javascript:void(0);' onclick=\"zan_method(" + userId + "," + commentId + "," + index + ")\">\n" +
                    "       <span id='zanCount" + index + "'></span>" +
                    "       <span>\n" +
                    "                点赞&nbsp;\n" +
                    "            </span>\n" +
                    "        </a>\n" +
                    "                    </span>\n";
                $("#ZanShow" + index + "").html(str);
                console.log("#ZanShow" + index + "");
                $.ajax({
                    type: 'post',
                    url: '/fr/storeInfo/zanCount/' + commentId + '',
                    success: function (res) {
                        console.log("点赞数:" + res.data)
                        $("#zanCount" + index + "").html(res.data)
                    }
                })
            }
        })
    }

    function js_method(page) {
        let userId = $("input[name='userIdHid']").val();
        $.ajax({
            type: 'post',
            //内部的js代码允许使用EL表达式的
            //jsp和js合二为一在同一个jsp文件中的 -> 容器执行的 - 编译jsp
            url: '${path}/storeInfo/comments/${fShop.id}/' + page + '',
            success: function (data) {
                console.log(data.data);
                let list = data.data;
                let str = "";
                let page = "";
                let Page = "";
                $.each(list, function (index, item) {
                    //console.log("current" + item.current);
                    //console.log("page" + item.page);
                    console.log(item);
                    str += "<div class='comment-info'>\n" +
                        "    <div class='coment-top'>\n" +
                        "        <a href=''><img src='" + item.headPicture + "' alt=''></a>\n" +
                        "        <div class='customer-name'>\n" +
                        "                <span>\n" +
                        "                    <a href=''>\n" +
                        "        " + item.userName + "\n" +
                        "                    </a>\n" +
                        "                    &nbsp;写了一条评价\n" +
                        "                    " + item.commentTime + "\n" +
                        "                </span>\n" +
                        "        </div>\n" +
                        "    </div>\n" +
                        "    <div class='customer-comment'>\n" +
                        "        <div>\n" +
                        "            <div id='score2'></div>\n" +
                        "        </div>\n" +
                        "        <div>\n" +
                        "            <div class='row boxp box'>\n" +
                        "                <q>\n" +
                        "        <span>\n" +
                        "            " + item.content + "\n" +
                        "        </span>\n" +
                        "                </q>\n" +
                        "            </div>\n" +
                        "            <div class='row info-more'>\n" +
                        "                <span class='more-text'>阅读更多</span>\n" +
                        "                <span class='glyphicon glyphicon-chevron-down'></span>\n" +
                        "            </div>\n" +
                        "            <div class='row more-details'>\n" +
                        "                <div class='row'>\n"
                    if (item.url1 != null) {
                        str += " <img src='" + item.url1 + "' alt=\"\" style=\"width: 80px;height: 60px;object-fit: cover;margin-right: 2px;\">\n"
                    }
                    if (item.url2 != null) {
                        str += " <img src='" + item.url2 + "' alt=\"\" style=\"width: 80px;height: 60px;object-fit: cover;margin-right: 2px;\">\n"
                    }
                    if (item.url3 != null) {
                        str += " <img src='" + item.url3 + "' alt=\"\" style=\"width: 80px;height: 60px;object-fit: cover;margin-right: 2px;\">\n"
                    }
                    if (item.url4 != null) {
                        str += " <img src='" + item.url4 + "' alt=\"\" style=\"width: 80px;height: 60px;object-fit: cover;margin-right: 2px;\">\n"
                    }
                    if (item.url5 != null) {
                        str += " <img src='" + item.url5 + "' alt=\"\" style=\"width: 80px;height: 60px;object-fit: cover;margin-right: 2px;\">\n"
                    }
                    if (item.url6 != null) {
                        str += " <img src='" + item.url6 + "' alt=\"\" style=\"width: 80px;height: 60px;object-fit: cover;margin-right: 2px;\">\n"
                    }
                    str += "                </div>\n" +
                        "            </div>\n" +
                        "        </div>\n" +
                        "    </div>\n" +
                        "\n" +
                        "    <div class='praise'>\n" +
                        "        <div class='row'>\n" +
                        "            <div style='float: left;'>\n" +
                        "                <a >\n" +
                        "        <span class=\"Level-1-reply\">\n" +
                        "            回复\n" +
                        "        </span>\n" +
                        "                </a>\n" +
                        "            </div>\n" +
                        "            <div id='ZanShow" + index + "' style='float: right;'>\n" +
                        "\n";
                    if (item.status == 3) {
                        str += "        <span>\n" +
                            "            <img src='/fr/imgs/storeInfo/爱心.png' alt=''>\n" +
                            "        </span>\n" +
                            "        <a href='javascript:void(0);' onclick=\"zan_method(" + userId + "," + item.commentId + "," + index + ")\">\n" +
                            "       <span id='zanCount" + index + "'></span>" +
                            "       <span>\n" +
                            "                点赞&nbsp;\n" +
                            "            </span>\n" +
                            "        </a>\n" +
                            "                    </span>\n" +
                            "            </div>\n" +
                            "        </div>\n" +
                            "    </div>"

                    } else {
                        str += "        <span>\n" +
                            "            <img src='/fr/imgs/storeInfo/爱心赞.png' alt=''>\n" +
                            "        </span>\n" +
                            "        <a href='javascript:void(0);' onclick=\"cancelZan_method(" + userId + "," + item.commentId + "," + index + ")\">\n" +
                            "       <span id='zanCount" + index + "'></span>" +
                            "       <span>\n" +
                            "                取消点赞&nbsp;\n" +
                            "            </span>\n" +
                            "        </a>\n" +
                            "                    </span>\n" +
                            "            </div>\n" +
                            "        </div>\n" +
                            "    </div>\n" +
                            "</div>";
                    }


                    str += "    <div class='reply-wapper'>\n" +
                        "        <div class='reply-comment r1'>\n" +
                        "            <form id='reply-form" + index + "' action=''>\n" +
                        "              <div class='form-top'>\n" +
                        "                  <small class='text-secondary'>回复" +
                        "                       <a>" + item.userName + "</a>\n" +
                        "                  </small>\n" +
                        "                  <input id='userId' name='userId' value='" + ${sessionScope.user.id} + "' style=\"display: none\">" +
                        "                  <input id='commentId' name='commentId' value='" + item.commentId + "' style=\"display: none\">" +
                        "                  <div class='reply-content'>" +
                        "                   <textarea rows='1' placeholder='撰写回复 …' id='content' name='content' class='form-control form-control-sm comment-reply mt-2 form-control form-control-sm'\n" +
                        "                       style='overflow-x: hidden; overflow-wrap: break-word; height: 34px;resize: vertical;'></textarea>\n" +
                        "                  </div>\n" +
                        "               </div>\n" +
                        "              <div class='form-bottom'>\n" +
                        "                  <button type='button' id='submit-reply' onclick='reply_method(" + index + ")' class='float-end btn btn-primary btn-sm'>提交评论</button>\n" +
                        "              </div>\n" +
                        "             </form>\n" +
                        "       </div>\n" +
                        "       <div class='reply-info" + index + " ri'>\n" +
                        "       </div>\n" +
                        "  </div>\n" +
                        "</div>"

                    let commentId = item.commentId;
                    console.log("commentId：" + commentId);

                    getReply(item.commentId, index);

                    page = "<div class='comment-info'>" +
                        "<ul class=\"page-info\">";
                    if (item.current >= 2) {
                        page += "<li class=\"previous-page ui-button\"><a href=\"javascript:void(0);\" role=\"button\" aria-disabled=\"true\" aria-label=\"Previous page\" onclick=\"js_method(" + (item.current - 1) + ")\">上一页</a></li>";
                    } else {
                        page += " <li class=\"previous-page ui-button\" class=\"disabled\"><a role=\"button\" aria-disabled=\"true\" aria-label=\"Previous page\">上一页</a></li>";
                    }
                    if (item.current > 3 && item.current + 3 <= item.page) {
                        for (let i = item.current - 3; i <= item.current + 3; i++) {
                            if (i == item.current) {
                                page += "<li  class=\"active\" style='background-color: #1ab394;border-radius: 3px;'><a role=\"button\" class=\"pageNum\" tabindex=\"0\">" + i + "</a></li>";
                            } else {
                                page += "<li><a role=\"button\" class=\"pageNum\" tabindex=\"0\" href=\"javascript:void(0);\" onclick=\"js_method(" + i + ")\">" + i + "</a></li>"
                            }
                        }

                    } else if (item.current >= 1 && item.current < 4 && item.page >= 7) {
                        for (let i = 1; i <= 7; i++) {
                            if (i == item.current) {
                                page += "<li  class=\"active\" style='background-color: #1ab394;border-radius: 3px;'><a role=\"button\" class=\"pageNum\" tabindex=\"0\">" + i + "</a></li>";
                            } else {
                                page += "<li><a role=\"button\" class=\"pageNum\" tabindex=\"0\" href=\"javascript:void(0);\" onclick=\"js_method(" + i + ")\">" + i + "</a></li>"
                            }
                        }
                    } else {
                        for (let i = (item.page - 6) >= 0 ? (item.page - 6) : 1; i <= item.page; i++) {
                            if (i == item.current) {
                                page += "<li  class=\"active\" style='background-color: #1ab394;border-radius: 3px;'><a role=\"button\" class=\"pageNum\" tabindex=\"0\">" + i + "</a></li>";
                            } else {
                                page += "<li><a role=\"button\" class=\"pageNum\" tabindex=\"0\" href=\"javascript:void(0);\" onclick=\"js_method(" + i + ")\">" + i + "</a></li>"
                            }
                        }
                    }
                    if (item.current < item.page) {
                        page += "<li class=\"previous-page ui-button\" style=\"float: right;\"><a role=\"button\" aria-disabled=\"true\" aria-label=\"Previous page\" href=\"javascript:void(0);\" onclick=\"js_method(" + (item.current + 1) + ")\">下一页</a></li>";
                    } else {
                        page += " <li class=\"previous-page ui-button disabled\"><a role=\"button\" aria-disabled=\"true\" aria-label=\"Previous page\">下一页</a></li>";
                    }

                    // page += "     <li><a>当前页" + item.current + "/" + item.page + "总页数</a></li>" +
                    //     "   </ul>" +
                    //     "</div>";
                    Page = page;
                    $.ajax({
                        type: 'post',
                        url: '/fr/storeInfo/zanCount/' + item.commentId + '',
                        success: function (res) {
                            console.log("点赞数:" + res.data)
                            $("#zanCount" + index + "").html(res.data)
                        }
                    })
                })
                flag = true;
                $(".comments").html(str);
                $(".pages").html(Page);

                //显示三行 多余隐藏 点击展开
                $('.info-more').each(function (i) {
                    $(this).click(function () {
                        if ($('.boxp').eq(i).is('.box')) {
                            $('.boxp').eq(i).removeClass('box');
                            $(this).eq(i).children("span.more-text").text("收起全文");
                            $(this).eq(i).children("span.glyphicon-chevron-down").removeClass("glyphicon-chevron-down");
                            $(this).eq(i).children("span.glyphicon").addClass("glyphicon-chevron-up")
                        } else {
                            $(this).eq(i).children("span.more-text").text("阅读更多");
                            $(this).eq(i).children("span.glyphicon-chevron-up").removeClass("glyphicon-chevron-up");
                            $(this).eq(i).children("span.glyphicon").addClass("glyphicon-chevron-down")
                            $('.boxp').eq(i).addClass('box');
                        }
                        $('.more-details').eq(i).toggle();
                        $('.more-detail').eq(i).toggle();
                    });
                })

                $('.Level-2-reply').each(function (i) {
                    $(this).click(function () {
                            if (${sessionScope.user == null}) {
                                alert("您还未登录，请先登录！")
                            } else {
                                if ($('.reply-card').eq(i).is('.r2')) {
                                    $('.reply-card').eq(i).removeClass("r2");
                                } else {
                                    $('.reply-card').eq(i).addClass("r2");
                                }
                            }
                        }
                    )
                })

                $('.Level-1-reply').each(function (i) {
                    $(this).click(function () {
                            if (${sessionScope.user == null}) {
                                alert("您还未登录，请先登录！")
                            } else {
                                if ($('.reply-comment').eq(i).is('.r1')) {
                                    $(".reply-comment").eq(i).removeClass("r1");
                                } else {
                                    $(".reply-comment").eq(i).addClass("r1");
                                }
                            }
                        }
                    )
                })
            }
        })
    }

    function imgShow(outerdiv, innerdiv, bigimg, _this) {
        var src = _this.attr("src"); //获取当前点击的pimg元素中的src属性
        $(bigimg).attr("src", src); //设置#bigimg元素的src属性
        /*获取当前点击图片的真实大小，并显示弹出层及大图*/
        $("<img/>").attr("src", src).load(function () {
            var windowW = $(window).width(); //获取当前窗口宽度
            var windowH = $(window).height(); //获取当前窗口高度
            var realWidth = this.width; //获取图片真实宽度
            var realHeight = this.height; //获取图片真实高度
            var imgWidth, imgHeight;
            var scale = 0.5; //缩放尺寸，当图片真实宽度和高度大于窗口宽度和高度时进行缩放
            if (realHeight > windowH * scale) { //判断图片高度
                imgHeight = windowH * scale; //如大于窗口高度，图片高度进行缩放
                imgWidth = imgHeight / realHeight * realWidth; //等比例缩放宽度
                if (imgWidth > windowW * scale) { //如宽度扔大于窗口宽度
                    imgWidth = windowW * scale; //再对宽度进行缩放
                }
            } else if (realWidth > windowW * scale) { //如图片高度合适，判断图片宽度
                imgWidth = windowW * scale; //如大于窗口宽度，图片宽度进行缩放
                imgHeight = imgWidth / realWidth * realHeight; //等比例缩放高度
            } else { //如果图片真实高度和宽度都符合要求，高宽不变
                imgWidth = realWidth;
                imgHeight = realHeight;
            }
            $(bigimg).css("width", imgWidth); //以最终的宽度对图片缩放
            var w = (windowW - imgWidth) / 2; //计算图片与窗口左边距
            var h = (windowH - imgHeight) / 10; //计算图片与窗口上边距
            $(innerdiv).css({
                "top": h,
                "left": w
            }); //设置#innerdiv的top和left属性
            $(outerdiv).fadeIn("fast"); //淡入显示#outerdiv及.pimg
        });
        $(outerdiv).click(function () { //再次点击淡出消失弹出层
            $(this).fadeOut("fast");
        });
    }

    // 评分
    layui.use(['rate'], function () {
        var rate = layui.rate;
        let score = ${fShopFractionDto.score};
        score = Math.floor(score * 2 + 0.5) / 2;
        // console.log(score);
        //半星效果
        rate.render({
            elem: '#score,#score1,#score2'
            , value: score //初始值
            , half: true //开启半星
            , readonly: true //开启只读
            , theme: '#00a680' //主题色
            // ,text: true //开启字体
        })

        let flavor = ${fShopFractionDto.flavor};
        flavor = Math.floor(flavor * 2 + 0.5) / 2;

        //半星效果
        rate.render({
            elem: '#flavor'
            , value: flavor //初始值
            , half: true //开启半星
            , readonly: true //开启只读
            , theme: '#00a680' //主题色
            // ,text: true //开启字体
        })

        let environment = ${fShopFractionDto.environment};
        environment = Math.floor(environment * 2 + 0.5) / 2;
        //半星效果
        rate.render({
            elem: '#environment'
            , value: environment //初始值
            , half: true //开启半星
            , readonly: true //开启只读
            , theme: '#00a680' //主题色
            // ,text: true //开启字体
        })

        let service = ${fShopFractionDto.service};
        service = Math.floor(service * 2 + 0.5) / 2;
        //半星效果
        rate.render({
            elem: '#service'
            , value: service //初始值
            , half: true //开启半星
            , readonly: true //开启只读
            , theme: '#00a680' //主题色
            // ,text: true //开启字体
        })
    });

</script>
</body>

</html>
